<template>
	<view class="consume">
		<view class="consume-item" v-for="item in recordList" :key="item.id">
			<view class="consume-left">
				<view class="num">{{item.remark}}</view>
				<view class="time">2020-06-22 14:02:26</view>
			</view>
			<view class="money">+365.00</view>
		</view>
		<view class="consume-item">
			<view class="consume-left">
				<view class="num">后台充值：SH20200622123456</view>
				<view class="time">2020-06-22 14:02:26</view>
			</view>
			<view class="money">+365.00</view>
		</view>
		<view class="consume-item">
			<view class="consume-left">
				<view class="num">微信充值：SH20200622123456</view>
				<view class="time">2020-06-22 14:02:26</view>
			</view>
			<view class="money">+365.00</view>
		</view>
		<view class="consume-item">
			<view class="consume-left">
				<view class="num">后台充值：SH20200622123456</view>
				<view class="time">2020-06-22 14:02:26</view>
			</view>
			<view class="money">+365.00</view>
		</view>
		
	</view>
</template>

<script>
	import service from '@/store/service.js';
	export default{
		data() {
			return {
				recordList:[]
			}
		},
		onLoad:function(){
			this.getRecharge()
		},
		methods:{
			getRecharge() {
				var self = this;
				self.$http.post(service.api.balance.record, {}).then(function(res) {
					var list = res.data;
					self.recordList = list;
				});
			}
		}
	}
</script>

<style scoped>
	.consume-item{
		background-color: #fff;
		margin-top: 20upx;
		display: flex;
		justify-content: space-between;
		padding:28upx 22upx  22upx;
	}
	.consume-left{
		
	}
	.num{
		font-weight:bold;
	}
	.time{
		color: #999;
		font-size:24upx;
		font-weight:500;
	}
	.money{
		display: flex;
		align-items: center;
		color: #f81149;
	}
	.consume-img{
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: 296upx;
	}
	.img{
		width: 522upx;
		height: 350upx;
	}
</style>
